<template>
    <!-- 导航栏 -->
    <van-nav-bar title="编辑收货地址" left-text="返回" left-arrow @click-left="back" />

    <!-- 编辑地址 -->
    <van-address-edit
        :area-list="areaList"
        show-set-default
        show-delete
        :area-columns-placeholder="['请选择', '请选择', '请选择']"
        :address-info="AddressInfo"
        @save="onSave"
        @delete="onDelete"
    />
</template>
<script>
    import { areaList } from '@vant/area-data';
    export default {
        emits: ['toggle'],
        created() {
            this.$emit('toggle', false);
            this.LoginUser = this.$cookies.get('LoginUser')
            this.id = this.$route.query.id
            this.addressdetail();
        },
        data() {
            return {
                areaList,
                AddressInfo: {},
                LoginUser: {},
                id: 0
            }
        },
        methods: {
            back() {
                this.$router.push('/user/address/index');
            },
            // 修改保存
            async onSave(content) {
                console.log(content);
                //组装数据
                var data = {
                    id: content.id,
                    consignee: content.name,
                    mobile: content.tel,
                    code: content.areaCode,
                    address: content.addressDetail,
                    status: content.isDefault ? 1 : 0,
                    userid: this.LoginUser.id
                }
                let result = await this.$api.AddressEdit(data)
                if (result.code == '1') {
                    this.$notify({
                        type: 'success',
                        message: result.msg,
                        duration: 1000,
                        onClose: () => {
                            this.back()
                        }
                    })
                } else {
                    this.$notify({
                        type: 'danger',
                        message: result.msg,
                        duration: 1000
                    })
                }
            },
            // 删除
            onDelete(content) {
                //弹出确认对话框
                this.$dialog.confirm({
                    'title': '收货地址',
                    'message': '是否确认删除收货地址'
                })
                    .then(async () => {
                        let data = {
                            id: content.id,
                            userid: this.LoginUser.id,
                            status: content.status
                        }

                        let result = await this.$api.AddressDelete(data)

                        if (result.code == '1') {
                            this.$notify({
                                type: 'success',
                                message: result.msg,
                                duration: 1000,
                                onClose: () => {
                                    this.back()
                                }
                            })
                        } else {
                            this.$notify({
                                type: 'danger',
                                message: result.msg,
                                duration: 1000
                            })
                        }
                    })
            },
            // 详情
            async addressdetail() {
                console.log(this.id)
                let result = await this.$api.AddressInfo({ id: this.id, userid: this.LoginUser.id })
                if (result.code == '1') {

                    var data = result.data


                    //重新组装我们的数据
                    var address = {
                        id: data.id,
                        name: data.consignee,
                        tel: data.mobile,
                        addressDetail: data.address,
                        isDefault: data.status == 1 ? true : false
                    }
                    if (data.province) {
                        address.province = data.province.name
                        address.areaCode = data.province.code
                    }

                    if (data.citys) {
                        address.citys = data.citys.name
                        address.areaCode = data.citys.code
                    }


                    if (data.districts) {
                        address.districts = data.districts.name
                        address.areaCode = data.districts.code
                    }

                    this.AddressInfo = address
                } else {
                    this.$notify({
                        message: result.msg,
                        duration: 1000,
                    })
                }
            }
        }
    }
</script>